<template>
  <Card
    v-loading="loading"
    :title="title"
    :bordered="false"
    :head-style="{ padding: '0' }"
    :body-style="{ padding: '10px 0' }"
  >
    <table width="80%" align="center" class="tabStyle_1 percent60">
      <thead>
        <tr>
          <td class="tabStyle_1_title" colspan="4">管理员</td>
        </tr>
      </thead>
      <tr>
        <td width="15%">性别</td>
        <td width="33%" align="center"> 男 </td>
        <td colspan="2" rowspan="8" align="center" valign="middle" id="photoTd"> 12123 </td>
      </tr>
      <tr>
        <td>部门</td>
        <td align="center"></td>
      </tr>
      <tr>
        <td>E-mail</td>
        <td align="center">1119032388@qq.com</td>
      </tr>
      <tr>
        <td>QQ</td>
        <td align="center">2</td>
      </tr>
      <tr>
        <td>电话</td>
        <td align="center">1231</td>
      </tr>
      <tr>
        <td>手机号码</td>
        <td align="center">13199999999</td>
      </tr>
      <tr style="display: none">
        <td>职务</td>
        <td align="center">123321</td>
      </tr>
      <tr>
        <td>角色</td>
        <td align="center"> 全部用户 </td>
      </tr>
      <tr>
        <td>政治面貌</td>
        <td align="center"></td>
      </tr>

      <tr>
        <td>省份</td>
        <td align="center"> </td>
        <td style="width: 80px">城市</td>
        <td align="center">&nbsp;</td>
      </tr>
      <tr>
        <td>地址</td>
        <td align="center">1231太热 </td>
        <td>邮政编码</td>
        <td align="center">213</td>
      </tr>
      <tr>
        <td>兴趣爱好</td>
        <td align="center">123123</td>
        <td>&nbsp;</td>
        <td align="center">&nbsp;</td>
      </tr>

      <tr>
        <td colspan="4" align="center">
          <a-button @click="handleToMessage" class="mt-2 mb-2"> 短消息 </a-button>
          <!-- <input
            class="btn"
            type="button"
            value="短消息"
            onclick="window.location.href='message_oa/message_frame.jsp?op=send&receiver=admin'"
          /> -->
        </td>
      </tr>
    </table>
  </Card>
</template>
<script lang="ts" setup>
  import { ref, onMounted } from 'vue';
  import { Card } from 'ant-design-vue';
  import { useRouter } from 'vue-router';
  import { useGo } from '/@/hooks/web/usePage';
  const title = ref('');
  const loading = ref(false);
  const { currentRoute } = useRouter();
  const fetch = () => {
    if (currentRoute.value.query.title) {
      title.value = '用户信息-' + currentRoute.value.query.title;
    } else {
      title.value = '用户信息';
    }
  };

  onMounted(fetch);

  const go = useGo();
  const handleToMessage = () => {
    // if(!currentRoute.value.query.path) return
    go({
      path: '/internalEmail',
      query: {
        receiver: 'admin',
        receiverName: '管理员',
      },
    });
  };
</script>

<style lang="less" scoped>
  :deep(.ant-card-head-title) {
    padding: 8px 8px 0;
  }
  .percent60 {
    width: 60% !important;
  }
  .tabStyle_1 {
    width: 98%;
    margin: 0px auto;
    border-collapse: collapse;
    margin-bottom: 10px;
    margin-top: 0px;
    clear: both;
    font-family: '微软雅黑';
    /*color:#696969;*/
    background-color: #ffffff;
    border: 1px solid #d5d5d5;
  }
</style>
